<template>
  <div>
    <h1>home</h1>
    <p>{{ msg }}</p>
    <h2>文件上传</h2>
    <tr>
      <!-- <td><input id="fileId_uid" type="file" name="file" v-on:change= "changgefile(fileId_uid)"></td>
                <td><input id="fileId2" type="file" name="file2" v-on:change= "changgefile"></td> -->

      <!-- <img  id="uploadPreview" style="width: 100%; height: 100%;"> -->
      <td v-for="(item, index) in infoMode1" :key="index">{{ item.name }}<input type="file" @change="changgefile(item,$event)"></td>
    </tr>
    <tr>
      <td><input type="submit" value="上传svg文件" @click="uploadConfig"></td>
    </tr><tr>
      <a href="javascript:void(0)" @click="testDownload">下载</a>

    </tr>
    <tr>
      <!-- <td><input id="fileId_uid" type="file" name="file" v-on:change= "changgefile(fileId_uid)"></td>
                <td><input id="fileId2" type="file" name="file2" v-on:change= "changgefile"></td> -->

      <!-- <img  id="uploadPreview" style="width: 100%; height: 100%;"> -->
      <td v-for="(item, index) in infoMode" :key="index">{{ item.name }}<input type="file" @change="changgefile(item,$event)"></td>
    </tr>

    <tr>
      <td><input type="submit" value="上传图片" @click="uploadSrc"></td>
    </tr><tr>
      <a href="javascript:void(0)" @click="testDownload">下载</a>

    </tr>
  </div>

</template>
<script>
import service from '@service/httpRequest.js'
var data
// const body = new FormData();
export default {
  data() {
    return {
      msg: '我是home 组件',
      profileinfo: '获取环境配置信息',
      fileinfo: '',
      infoMode1: [
        {
          uid: '1433a14a-4007-42e9-99c1-827ac494e01d',
          id: 'id_111',
          name: 'name_111',
          value: null
        }
      ],
      infoMode: [
        {
          uid: '58aeca61-2b2e-48d1-9ea0-30f241966d14',
          id: 'id_111',
          name: 'name_111',
          value: null
        },
        {
          uid: 'bd832631-52f2-40f2-8b6f-66eaad6384f1',
          id: 'id_222',
          name: 'name_222',
          value: null
        },
        {
          uid: '152618c4-445f-436a-a75d-d6e73c214eeb',
          id: 'id_333',
          name: 'name_333',
          value: null
        }
      ],
      uploadFile: {}
    }
  },
  methods: {
    uploadConfig(actionId, data, fileinfo) {
      data = [{ 'uid': '1433a14a-4007-42e9-99c1-827ac494e01d' }, { 'uid': '99999999-4007-42e9-99c1-827ac494e01d' }]
      debugger
      service.uploadConfig(2101, data, this.uploadFile)
    },
    uploadSrc(actionId, fileinfo) {
      // 添加站
      // actionId = 3101
      //       data = [{
      // 	"id":"test3","name":"测试3","flag":true,"parent_uid":"30364e51-f32f-45bc-ae76-8051af8eb72a","pre_uid":"6d5543ee-3b44-47ec-8bc5-7d4dc189cf3c","category_uid":"bd34c21c-32db-49b5-84d2-a549989c909f",
      // 	"info":[{"info_uid":"58aeca61-2b2e-48d1-9ea0-30f241966d14","infoset_uid":null,"value":"联系人小as"},{"info_uid":"bd832631-52f2-40f2-8b6f-66eaad6384f1","infoset_uid":null,"value":"联系人小as"},{"info_uid":"152618c4-445f-436a-a75d-d6e73c214eeb","infoset_uid":null,"value":"联系人小as"}],
      // 	"relation":[{"relation_uid":"3b6c8128-38e9-4e28-a748-5c74f0f93aa4","target_uid":"30364e51-f32f-45bc-ae76-8051af8eb72a"}],
      //   "remove_info":[{"info_uid":"58aeca61-2b2e-48d1-9ea0-30f241966d14","info_id":"","infoset_uid":"","infosetid":"","value":"/1.jpg"},{"info_uid":"bd832631-52f2-40f2-8b6f-66eaad6384f1","info_id":"","infoset_uid":"","infosetid":"","value":"/2.jpg"}]
      // }];
      // 编辑站
      actionId = 3103
      data = [{
        'uid': '1b05cbe5-72e3-4ebc-b630-2a329d45d2ac', 'id': 'test5', 'name': '测试5', 'flag': true, 'parent_uid': '04763168-62c3-4a72-a264-cc8c87ea2961', 'pre_uid': 'cc94e28d-6f01-48ef-85ae-cfc911e92f91', 'category_uid': 'bd34c21c-32db-49b5-84d2-a549989c909f',
        'info': [{ 'info_uid': '58aeca61-2b2e-48d1-9ea0-30f241966d14', 'infoset_uid': null, 'value': '联系人小as' }, { 'info_uid': 'bd832631-52f2-40f2-8b6f-66eaad6384f1', 'infoset_uid': null, 'value': '联系人小as' }, { 'info_uid': '152618c4-445f-436a-a75d-d6e73c214eeb', 'infoset_uid': null, 'value': '联系人小as' }],
        'relation': [{ 'relation_uid': '3b6c8128-38e9-4e28-a748-5c74f0f93aa4', 'target_uid': '30364e51-f32f-45bc-ae76-8051af8eb72a' }],
        'remove_info': [{ 'info_uid': '58aeca61-2b2e-48d1-9ea0-30f241966d14', 'info_id': '', 'infoset_uid': '', 'infosetid': '', 'value': '/1.jpg' }, { 'info_uid': 'bd832631-52f2-40f2-8b6f-66eaad6384f1', 'info_id': '', 'infoset_uid': '', 'infosetid': '', 'value': '/2.jpg' }]
      }]

      service.uploadSrc(actionId, data, this.uploadFile)
    },
    testDownload(actionId) {
      service.testDownload(actionId)
    },
    changgefile(item, e) {
      // fileObj = document.getElementById('fileId').files; // js 获取文件对象
      // fileObj2 = document.getElementById('fileId2').files; // js 获取文件对象
      // body.append(fileId_uid,fileObj)
      // data = [fileObj,fileObj2];
      this.uploadFile[item.uid] = e.target.files[0]
      // var reader = new FileReader();
      // reader.readAsDataURL(fileObj[0]);
      // reader.onload = function (oFREvent) {
      //   document.getElementById('uploadPreview').src = oFREvent.target.result;
      // };
    },
    getprofileinfo() {
      service.getprofileinfo()
    },
    setMessageInnerHTML(innerHTML) {
      document.getElementById('message').innerHTML += innerHTML + '<br/>'
    }
  }
}
</script>
